<template>
	<gui-page>
		<view slot="gBody" class="all">
			<view class="gui-flex gui-space-between kuai">
				<view class="">
					上级邀请人
				</view>
				<view class="">
					{{shang.phone ? shang.phone : '最高级'}} |  {{shang.user_no ? shang.user_no : '最高级'}}
				</view>
			</view>
			<gui-empty v-if="list.length<=0">
				<view slot="img" class="gui-flex gui-rows gui-justify-content-center">
					<!-- 请根据您的项目要求制作并更换为空图片 -->
					<image class="gui-empty-img" 
					src="https://upload-images.jianshu.io/upload_images/15372054-1f849183cebb80b1.png?imageMogr2/auto-orient/strip|imageView2/2/w/388/format/webp"></image>
				</view>
				<text slot="text" 
				class="gui-text-small gui-block-text gui-text-center gui-margin-top" style="color:#9DABFF;">暂无数据 ......</text>
			</gui-empty>
			
			
			<view class="gui-border-b" v-for="(item,index) in list" :key='item.id'>
				<view class="list gui-flex " >
					<view class="l_left">
						<image :src="item.avatarUrl ? imgServer+item.avatarUrl : '../../static/logo.png'" mode="widthFix"></image>
					</view>
					<view class="l_right">
						<view class="gui-flex gui-space-between">
							<view class="name">
								{{item.name ? item.name : '尚未填写'}}
							</view>
							<view class="time">
								手机号：{{item.phone}}
							</view>
						</view>
						<view class="gui-flex gui-space-between gui-align-items-center">
							<view class="phone">
								加入时间：<text>{{item.create_time}}</text>
							</view>
							<view class="shen">
								<text v-if="item.level==0">普通会员</text>
								<text v-if="item.level==1">1星会员</text>
								<text v-if="item.level==2">2星会员</text>
								<text v-if="item.level==3">3星会员</text>
								<text v-if="item.level==4">4星会员</text>
								<text v-if="item.level==5">5星会员</text>
								<text v-if="item.level==6">6星会员</text>
								<text v-if="item.level==7">7星会员</text>
							</view>
						</view>
					</view>
				</view>
				
			</view>
			
			
		</view>
	</gui-page>
</template>

<script>
	let common = require('@/common.js');
	export default {
		data() {
			return {
				shang: {},
				imgServer:'',
				list:[]
			};
		},
		onLoad: function() {
			this.imgServer=common.imgServer
		},
		onShow() {
			uni.common.post(
				uni.common.apiServer + 'my',
				{
					type: 'get_my_tui_info',
				},
				false,
				res => {
					if (res.code == 1) {
						this.shang=res.shang
						for (let i in res.data) {
							res.data[i].create_time=uni.common.to_time(res.data[i].create_time,2)
						}
						this.list=res.data
					} else {
						uni.showToast({
							icon: 'none',
							title: '获取数据失败'
						});
					}
				},
				e => {
					console.log(e);
				}
			);
		},
		methods: {
			huan(){
				uni.navigateTo({
					url: './caijian'
				});
			},
			
		}
	};
</script>

<style>
.kuai{
	padding: 50rpx 30rpx;
	/* border-radius: 20rpx; */
	color: #FFFFFF;
	background-image: linear-gradient( #f14646 0%, #f14242 100%);
	border-radius: 30rpx;
	margin:  30rpx;
}
.list{
	background-color: #FFFFFF;
	padding: 20rpx 40rpx;
	width: 100%;
	box-sizing: border-box;
}
.l_left{
	width: 10%;
	flex-shrink: 1;
	overflow: hidden;
	margin-right: 20rpx;
}
.l_left image{
	width: 100%;
	border-radius: 50%;
	overflow: hidden;
}
.l_right{
	width: 90%;
}
.name{
	font-size: 28rpx;
	color: #343434;
}
.time{
	font-size: 24rpx;
	color: #a3a3a3;
}
.phone{
	font-size: 24rpx;
	margin-top: 10rpx;
	color: #a3a3a3;
}
.shen{
	background-color: #FFA048;
	color: #FFFFFF;
	font-size: 22rpx;
	
	border-radius: 30rpx;
	display: inline-block;
	padding: 8rpx 10rpx;
}
.lizhili{
	font-size: 28rpx;
	color: #b8b8b8;
	line-height: 2;
	background-color: #FFFFFF;
	padding: 0rpx 40rpx 20rpx 40rpx;
	width: 100%;
	box-sizing: border-box;
}
.lizhili text{
	line-height: 2;
	font-size: 28rpx;
	color: #ffaa00;
	padding: 0 15rpx;
}
</style>
